<!DOCTYPE html>
<html lang="en">
<head>
    #include("../include/header.html")
</head>
<body>

<div class="container">
    #include("../include/menu.html")

    <!-- 工具栏 -->
    <div class="row" style="margin-bottom: 10px">
        <div class="col-sm-12">
            <div class="pull-left" style="height: 300px;border: 1px solid #CCC;overflow: auto">
                <input type="text" placeholder="搜索项目" name="treeSearchText">
                <button type="button" onclick="treeSearch()">搜索</button>
                <ul id="treeDemo" class="ztree"></ul>
            </div>
        </div>
    </div>


</div>

#include("../include/footer.html")

<SCRIPT type="text/javascript">
    var setting = {
        view: {
            showLine: false
        }
    };
    var zNodes = [];
    var zTree;
    $(document).ready(function () {
        initTree();
    });

    function initTree() {
        var keyword = $('input[name="treeSearchText"]').val();
        $.get('/demo/treeData?keyword=' + keyword, function (data, status) {
            if (data && data.result === 100) {
                zNodes = data.data;
                zTree = $.fn.zTree.init($("#treeDemo"), setting, zNodes);
                zTree.expandAll(true);
            } else {
                toastr.error('操作失败：' + data.message);
            }
        });
    }

    function treeSearch() {
        initTree();
    }
</script>
</body>
</html>